
<div style="POSITION: relative" id="content">
  <h3>easyui 过滤ComboGrid </h3>
  <div id="article_content" class="article_content">
	<p>combogrid 组件和combobox 组件有这个相同的功能函数除了下拉框是基于一个datagrid的,combogrid 组件可以过滤,分页和一些其他的datagrid 的功能.
</p>
<p>这个教程向你展示如果过滤数据记录在一个combogrid组件.</p>
<p><img src="documentation/images/1344914730_3854.png" alt=""></p>
<h4 style="font-size:16px; color:rgb(204,0,0); margin:10px 0px; font-family:Arial,Helvetica,'Nimbus Sans L',sans-serif; text-align:left">
  创建 ComboGrid</h4>
<div><pre name="code" class="html">&lt;input id=&quot;cg&quot; style=&quot;width:150px&quot;&gt;  </pre><pre name="code" class="javascript">$('#cg').combogrid({  
    panelWidth:500,  
    url: 'form5_getdata.php',  
    idField:'itemid',  
    textField:'productid',  
    mode:'remote',  
    fitColumns:true,  

    columns:[[  
        {field:'itemid',title:'Item ID',width:60},  
        {field:'productid',title:'Product ID',align:'right',width:80},  
        {field:'listprice',title:'List Price',align:'right',width:60},  
        {field:'unitcost',title:'Unit Cost',align:'right',width:60},  
        {field:'attr1',title:'Attribute',width:150},  
        {field:'status',title:'Stauts',align:'center',width:60}  
    ]]  
}); </pre>
combogrid 组件应该定义 'idField' 和'textField'属性.'idField'属性存储着组件值和'textField' 属性显示消息文本在input box.,combogrid 组件可以过滤
</div>
<div>它的记录子在&nbsp;'local'
 或者 'remote'模式.在远程(remote)模combogrid 将发送'q'参数到远程服务器当用户输入字符到&nbsp;input文本框中.</div>
<div>
<h4 style="font-size:16px; color:rgb(204,0,0); margin:10px 0px; font-family:Arial,Helvetica,'Nimbus Sans L',sans-serif; text-align:left">
服务器代码</h4>
<span style="font-family:Arial,Helvetica,'Nimbus Sans L',sans-serif; font-size:14px; text-align:left">form5_getdata.php</span></div>
<div><pre name="code" class="php">$q = isset($_POST['q']) ? strval($_POST['q']) : '';  
  
include 'conn.php';  
  
$rs = mysql_query(&quot;select * from item where itemid like '%$q%' or productid like '%$q%'&quot;);  
$rows = array();  
while($row = mysql_fetch_assoc($rs)){  
    $rows[] = $row;  
}  
echo json_encode($rows);  </pre>
<h4 style="font-size:16px; color:rgb(204,0,0); margin:10px 0px; font-family:Arial,Helvetica,'Nimbus Sans L',sans-serif; text-align:left">
下载 EasyUI 示例代码:</h4>
<div style="font-size:14px; font-family:Arial,Helvetica,'Nimbus Sans L',sans-serif; text-align:left; padding-left:50px">
<a href="http://www.jeasyui.com/tutorial/form/downloads/easyui-form5-demo.zip" target="_blank" class="download-link" style="color:rgb(0,0,255)">easyui-form-demo.zip</a></div>
<br>
  </div>
</div>
<SCRIPT type=text/javascript>
	dp.SyntaxHighlighter.ClipboardSwf = 'documentation/js/clipboard.swf'/*tpa=http://jeasyui.com/SyntaxHighlighter/Scripts/clipboard.swf*/;
	dp.SyntaxHighlighter.HighlightAll('code');
</SCRIPT>